<template lang="">
    <div class="ques-outer">
        <div class="ques-mask"></div> <!-- 上层蒙版 -->
        <span class="edit-ques-index">{{index+1}}:</span><span>{{question.queQue}}</span>
        <div class="edit-ques-options">
            <el-checkbox v-for="(item,index) in option" :key="index">{{item}}</el-checkbox>
        </div>
        <el-button-group v-if="isEditQues">
            <el-button type="primary" icon="el-icon-edit" size="small" @click="updateQues">编辑</el-button>
            <el-button type="primary" icon="el-icon-delete" size="small" @click="deleteQues">删除</el-button>
        </el-button-group>
        <div class="ques-box-button" v-if="!isEditQues"></div>
    </div>
</template>
<script>
    import contrast from '../../getOptionsJS/option.js'
    export default {
        name: 'Multiple',
        props: ['question', 'index','isEditQues'],
        data() {
            return {
                option: {},
            }
        },
        methods: {
            getOption(question) {

                this.option = contrast.getOption(question)    //contrast.getOption(question)是在调用封装的函数
            },
            updateQues() {
                this.$bus.$emit('updateQues', this.question)
            },
            deleteQues() {
                console.log('删除queId',this.question.queId);
                axios({
                    method: 'POST',
                    url: '/question/deleteQuestion',
                    data: JSON.stringify(this.question.queId),
                    headers: {
                        'Content-Type': 'application/json'
                    }
                }).then((result) => {
                    if (result.data == 0) {
                        this.$message({
                            type: 'error',
                            message: '删除失败'
                        })
                    } else {
                        this.$message({
                            type: 'success',
                            message: '删除成功'
                        })
                        this.$bus.$emit('addQuesSuccess')   //告知删除成功

                    }
                }).catch((err) => {
                    this.$message({
                        type: 'info',
                        message: err.message
                    })
                });
            }
        },
        mounted() {
            this.getOption(this.question)
        },
    }
</script>
<style scoped>
    .el-button-group{
        margin: 20px;
    }
</style>